<template>
  <div>
    <div class="body-item">
      <el-select v-if="identity === 'client'"
                 class="select"
                 v-model="pagination.value1"
                 :placeholder="clientInput.getInput(name)[0].value">
        <el-option
            v-for="item in clientInput.getInput(name)"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>
      <el-select v-if="identity === 'carriers'"
                 class="select"
                 v-model="pagination.value1"
                 :placeholder="carriersInput.getInput(name)[0].value">
        <el-option
            v-for="item in carriersInput.getInput(name)"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>
      <el-select v-if="identity === 'driver'"
                 class="select"
                 v-model="pagination.value1"
                 :placeholder="driverInput.getInput(name)[0].value">
        <el-option
            v-for="item in driverInput.getInput(name)"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>

      <el-input type="text"
                style="width: 200px;margin-left: 10px"
                v-model="pagination.input"
                placeholder="请输入"/>

      <!--      动力资源管理页面时显示-->
      <span v-if="identity === 'carriers' && name === 'carsManage'"
            style="margin-left: 20px">车型:</span>
      <el-select v-if="identity === 'carriers' && name === 'carsManage'"
                 class="select"
                 style="margin-left: 10px"
                 v-model="pagination.car"
                 placeholder="请选择">
        <el-option
            v-for="item in carriersCarOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>
      <span v-if="identity === 'carriers' && name === 'carsManage'"
            style="margin-left: 10px">车辆状态:</span>
      <el-select v-if="identity === 'carriers' && name === 'carsManage'"
                 class="select"
                 style="margin-left: 10px"
                 v-model="pagination.carStatus"
                 placeholder="请输入">
        <el-option
            v-for="item in carriersCarStatusOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>

      <el-select v-if="identity === 'client'"
                 class="select"
                 style="margin-left: 80px"
                 v-model="pagination.value2"
                 :placeholder="clientInput.getDate(name)[0].label">
        <el-option
            v-for="item in clientInput.getDate(name)"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>
      <!--      动力资源管理--车辆管理和KPI管理以及人员管理等页面时隐藏-->
      <el-select v-if="identity === 'carriers'
          && name !== 'carsManage' && name !== 'KPIManage' && name !== 'personManage'
          && name !== 'exception'"
                 class="select"
                 style="margin-left: 80px"
                 v-model="pagination.value2"
                 :placeholder="carriersInput.getDate(name)[0].value">
        <el-option
            v-for="item in carriersInput.getDate(name)"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>
      <!--      动力资源管理--车辆管理页面时显示-->
      <span v-if="identity === 'carriers' && name === 'carsManage'"
            style="margin-left: 10px">新增日期:</span>
      <!--      动力资源管理--人员管理页面时显示-->
      <span v-if="identity === 'carriers' && name === 'personManage'"
            style="margin-left: 40px">新增日期:</span>
      <!--      动力资源管理--KIP管理页面时显示-->
      <span v-if="identity === 'carriers' && name === 'KPIManage'"
            style="margin-left: 30px">数据类型：司机KPI数据&nbsp;&nbsp;&nbsp;&nbsp;排序:</span>
      <el-select v-if="identity === 'carriers' && name === 'KPIManage'"
                 class="select"
                 style="margin-left: 10px"
                 v-model="pagination.KPISort"
                 placeholder="请输入">
        <el-option
            v-for="item in carriersKPIOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>


      <el-select v-if="identity === 'driver'"
                 class="select"
                 style="margin-left: 80px"
                 v-model="pagination.value2"
                 :placeholder="driverInput.getDate(name)[0].label">
        <el-option
            v-for="item in driverInput.getDate(name)"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>
      <span v-if="name === 'client' && identity === 'carriers'"
            style="margin-left: 30px">注册日期</span>

      <!--      日期选择-->
      <el-date-picker
          v-if="name !== 'KPIManage'"
          class="date-picker"
          style="margin-left: 10px"
          v-model="pagination.startTime"
          type="date"
          placeholder="选择开始日期">
      </el-date-picker>
      <span v-if="name !== 'KPIManage'">&nbsp; - &nbsp;</span>
      <el-date-picker
          v-if="name !== 'KPIManage'"
          class="date-picker"
          style="margin-left: 10px"
          v-model="pagination.endTime"
          type="date"
          placeholder="选择结束日期">
      </el-date-picker>
      <el-button class="search"
                 style="margin-left: 20px"
                 @click="search(name)"
                 type="primary">搜索
      </el-button>
    </div>


    <!--    订单总览-->
    <div v-if="name === 'order'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity !== 'driver'"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">待审核(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'carriers'"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">等待询价处理(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'carriers'"
               @click="divActive(4)"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">询价中(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'carriers'"
               @click="divActive(5)"
               :class="active === 5 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(5)">等待添加报价(<span v-text="10"></span>)</a>
          </div>

          <div class="active-item" v-if="identity === 'driver'"
               @click="divActive(10)"
               :class="active === 10 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(10)">等待接单(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'driver'"
               @click="divActive(11)"
               :class="active === 11 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(11)">已结单(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'driver'"
               @click="divActive(12)"
               :class="active === 12 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(12)">已拒单(<span v-text="10"></span>)</a>
          </div>


          <div class="active-item"
               @click="divActive(6)"
               :class="active === 6 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(6)">已到期询价(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'carriers'"
               @click="divActive(7)"
               :class="active === 7 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(7)">已完成报价(<span v-text="10"></span>)</a>
          </div>


          <div class="active-item" v-if="identity === 'client'"
               @click="divActive(8)"
               :class="active === 8 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(8)">有效报价(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button v-if="identity === 'client'"
                   @click="$router.push({name: 'createOrder'})"
                   class="button">新增订单
        </el-button>
        <el-button v-if="identity === 'client'" class="button">下订单</el-button> <!--承运商报价后才能下定单，即在询价单之后-->

        <el-button v-if="identity === 'carriers'" class="button">审核</el-button>
        <el-button v-if="identity !== 'client'" class="button">询价处理</el-button>
        <el-button v-if="identity === 'carriers'" class="button">添加报价</el-button>
        <el-button v-if="identity !== 'client'" class="button">查看</el-button>

      </div>
    </div>
    <!--    询价单-->
    <div v-if="name === 'quotation'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="quotationPage(0)">待审核(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="quotationPage(0)">等待询价处理(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="quotationPage(0)">询价中(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(5)"
               :class="active === 5 ? activeClass:''">
            <a href="#" style="display: block"
               @click="quotationPage(0)">等待添加报价(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(6)"
               :class="active === 6 ? activeClass:''">
            <a href="#" style="display: block"
               @click="quotationPage(0)">已到期询价(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(7)"
               :class="active === 7 ? activeClass:''">
            <a href="#" style="display: block"
               @click="quotationPage(0)">已完成报价(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button" @click="auditQuotation">审核</el-button>
        <el-button class="button" @click="disposeQuotation">询价处理</el-button>
        <el-button class="button" @click="carriersDisposeQuote">添加报价</el-button>
        <el-button class="button" @click="quotationView">查看</el-button>
      </div>
    </div>
    <!--    询价单管理-->
    <div v-if="name === 'quotationManage'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="quotationPage(0)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="quotationPage(0)">待审核(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="quotationPage(0)">有效询价单(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="quotationPage(0)">过期询价单(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button @click="handoffRouter('createQuotation')" class="button">创建询价单</el-button>
        <el-button @click="clientOrder" class="button">下订单</el-button>
        <el-button class="button" @click="quotationView">查看</el-button>
      </div>
    </div>
    <!--    客户管理-->
    <div v-if="name === 'client'">
      <div class="body-item">
        <el-button class="button">新增客户</el-button>
        <el-button class="button">修改</el-button>
        <el-button class="button">查看</el-button>
      </div>
    </div>
    <!--    运输管理 --- 在途跟踪-->
    <div v-if="name === 'tracking'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity !== 'driver'"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">待发车(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">运输中(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">已抵达(<span v-text="10"></span>)</a>
          </div>
          <div v-if="identity === 'client'"
               class="active-item"
               @click="divActive(5)"
               :class="active === 5 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(5)">已收货(<span v-text="10"></span>)</a>
          </div>
          <div v-if="identity !== 'client'"
               class="active-item"
               @click="divActive(6)"
               :class="active === 6 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(6)">异常(<span v-text="10"></span>)</a>
          </div>
          <div v-if="identity !== 'client'"
               class="active-item"
               @click="divActive(7)"
               :class="active === 7 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(7)">晚点(<span v-text="10"></span>)</a>
          </div>

          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">查看</el-button>
        <el-button v-if="identity === 'carriers'" class="button">地图跟踪</el-button>
        <el-button v-if="identity === 'driver'" class="button">异常上报</el-button>

      </div>
    </div>
    <!--    运输管理 --- 提货单 -->
    <div v-if="name === 'billLading'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity !== 'driver'"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">待提货(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">已提货(<span v-text="10"></span>)</a>
          </div>

          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">查看</el-button>
        <el-button class="button">上传异常</el-button>
      </div>
    </div>
    <!--    运输管理 --- 运输计划 -->
    <div v-if="name === 'transportPlan'">
      <div class="body-item">
        <el-button class="button">货物拆分</el-button>
        <el-button class="button">路线拆分</el-button>
        <el-button class="button">撤销拆分</el-button>
        <el-button class="button">查看</el-button>
      </div>
    </div>
    <!--  运输计划/回单管理 --- 签收单-->
    <div v-if="name === 'signatureReceipt'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'carriers'"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">客户已确认(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)" v-if="identity === 'carriers'"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">客户未确认(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)" v-if="identity === 'carriers'"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">异常(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'driver'"
               @click="divActive(5)"
               :class="active === 5 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(5)">待处理(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'driver'"
               @click="divActive(6)"
               :class="active === 6 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(6)">已处理(<span v-text="10"></span>)</a>
          </div>

          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button v-if="identity === 'carriers'" class="button">上传异常</el-button>
        <el-button v-if="identity === 'carriers'" class="button">查看</el-button>
        <el-button v-if="identity === 'driver'" class="button">处理</el-button>
        <el-button v-if="identity === 'driver'" class="button">异常上报</el-button>
        <el-button v-if="identity === 'driver'" class="button">打印</el-button>
      </div>
    </div>
    <!--  运输计划/回单管理 --- 回单交接-->
    <div v-if="name === 'handoverReceipt'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'carriers'"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">司机已交单(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">司机未交单(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)" v-if="identity === 'carriers'"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">系统已确认(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'carriers'"
               @click="divActive(5)"
               :class="active === 5 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(5)">系统未确认(<span v-text="10"></span>)</a>
          </div>

          <div class="active-item" v-if="identity === 'driver'"
               @click="divActive(6)"
               :class="active === 6 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(6)">审核中(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" v-if="identity === 'driver'"
               @click="divActive(7)"
               :class="active === 7 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(7)">确认交单(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button v-if="identity === 'carriers'" class="button">上传异常</el-button>
        <el-button class="button">查看</el-button>
        <el-button v-if="identity === 'carriers'" class="button">处理</el-button>
        <el-button v-if="identity === 'driver'" class="button">异常上报</el-button>
      </div>
    </div>
    <!--  回单管理 --- 客户-->
    <div v-if="name === 'receiptManage'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">已确认(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">未确认(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">异常(<span v-text="10"></span>)</a>
          </div>

          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">回单确认</el-button>
        <el-button class="button">查看</el-button>
      </div>
    </div>
    <!--    调度管理 --- 调度配载-->
    <div v-if="name === 'loading'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">已处理(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">未处理(<span v-text="10"></span>)</a>
          </div>

          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">查看</el-button>
        <el-button class="button">调度处理</el-button>
      </div>
    </div>
    <!--    调度管理 --- 订单配发-->
    <div v-if="name === 'orderAllot'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">拒单(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">等待接单(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">接单超时(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(5)"
               :class="active === 5 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(5)">已支付预付款(<span v-text="10"></span>)</a>
          </div>

          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">

        <el-button class="button">查看</el-button>
        <el-button class="button">预付款处理</el-button>
        <el-button class="button">重新调度</el-button>

      </div>
    </div>
    <!--    结算管理 --- 订单结算-->
    <div v-if="name === 'orderSettlement'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">已结算(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">未结算(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">待审核(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(5)"
               :class="active === 5 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(5)">确认结算(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">查看</el-button>
      </div>
    </div>
    <!--    结算管理 --- 应收款结算-->
    <div v-if="name === 'receivablesSettlement'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">已结算(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">未结算(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">待审核(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(5)"
               :class="active === 5 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(5)">待客户确认(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(6)"
               :class="active === 6 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(6)">客户已确认(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(7)"
               :class="active === 7 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(7)">异常(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">

        <el-button class="button">查看</el-button>
        <el-button class="button">预付款处理</el-button>
        <el-button class="button">重新调度</el-button>

      </div>
    </div>
    <!--    结算管理 --- 应付款结算-->
    <div v-if="name === 'payableSettlement'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">已结算(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">未结算(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">待审核(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(5)"
               :class="active === 5 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(5)">已申报(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(6)"
               :class="active === 6 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(6)">待付款(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">调整价格</el-button>
        <el-button class="button">审批</el-button>
        <el-button class="button">结算处理</el-button>
      </div>
    </div>
    <!--    发票管理-->
    <div v-if="name === 'invoice'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">已开发票(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">未开发票(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">申请中(<span v-text="10"></span>)</a>
          </div>

          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">查看</el-button>

      </div>
    </div>
    <!--    动力资源管理 --- 车辆管理-->
    <div v-if="name === 'carsManage'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">自由车辆(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">外协车辆(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">新增车辆</el-button>
        <el-button class="button">修改</el-button>
        <el-button class="button">查看</el-button>

      </div>
    </div>
    <!--    动力资源管理 --- 人员管理-->
    <div v-if="name === 'personManage'">
      <div class="body-item">
        <el-button class="button">新增司机</el-button>
        <el-button class="button">修改</el-button>
        <el-button class="button">禁用</el-button>
        <el-button class="button">查看</el-button>

      </div>
    </div>
    <!--    报价管理 --- 待报价订单-->
    <div v-if="name === 'toBe'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="toBePage(0)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="toBePage(5)">已报价(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="toBePage(3)">未报价(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(4)"
               :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="toBePage(4)">已结束(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button" @click="disposeQuote">处理</el-button>
        <el-button class="button">打印</el-button>
      </div>
    </div>
    <!--    报价管理 --- 常规路线报价-->
    <div v-if="name === 'routine'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item"
               @click="divActive(1)"
               :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="transportPage(-1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(2)"
               :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="transportPage(1)">有效路线(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item"
               @click="divActive(3)"
               :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="transportPage(0)">无效路线(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button" @click="transportAdd">添加路线</el-button>
        <el-button class="button" @click="transportDel">删除路线</el-button>
        <el-button class="button" @click="transportView">修改路线</el-button>
      </div>
    </div>
    <!--    合同管理 --- 合同统计 -->
    <div v-if="name === 'contractStatistics'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item" @click="divActive(1)" :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(2)" :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">已签约(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(3)" :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">未签约(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(4)" :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">已过期(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">处理合同</el-button>
        <el-button class="button">查看</el-button>
        <el-button class="button">异常上报</el-button>
        <el-button class="button">打印</el-button>
      </div>
    </div>
    <!--    合同管理 --- 合同管理 -->
    <div v-if="name === 'contractManage'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item" @click="divActive(1)" :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(2)" :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">已签约(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(3)" :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">未签约(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(4)" :class="active === 4 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(4)">已过期(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">查看</el-button>
        <el-button class="button">打印</el-button>
      </div>
    </div>
    <!--    异常管理 --- 异常统计 -->
    <div v-if="name === 'exception'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item" @click="divActive(1)" :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(2)" :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">异常(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(3)" :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">已处理(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">查看</el-button>
      </div>
    </div>
    <!--    系统管理 --- 网点管理 -->
    <div v-if="name === 'outlets'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item" @click="divActive(1)" :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(2)" :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">已启用(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(3)" :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">已禁用(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">新增网点</el-button>
        <el-button class="button">修改</el-button>
        <el-button class="button">禁用</el-button>
        <el-button class="button">启用</el-button>
      </div>
    </div>
    <!--    系统管理 --- 司机账号管理 -->
    <div v-if="name === 'driversAccount'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item" @click="divActive(1)" :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(2)" :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">已禁用(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(3)" :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">已启用(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">新增司机账号</el-button>
        <el-button class="button">修改</el-button>
        <el-button class="button">禁用</el-button>
        <el-button class="button">启用</el-button>
      </div>
    </div>
    <!--    系统管理 --- 人员管理 -->
    <div v-if="name === 'person'">
      <div class="body-item">
        <div class="body-active">
          <div class="active-item" @click="divActive(1)" :class="active === 1 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(1)">全部(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(2)" :class="active === 2 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(2)">已禁用(<span v-text="10"></span>)</a>
          </div>
          <div class="active-item" @click="divActive(3)" :class="active === 3 ? activeClass:''">
            <a href="#" style="display: block"
               @click="change(3)">已启用(<span v-text="10"></span>)</a>
          </div>
          <div style="clear: both"></div>
        </div>
      </div>
      <div class="body-item">
        <el-button class="button">新增人员岗位</el-button>
        <el-button class="button">修改</el-button>
        <el-button class="button">禁用</el-button>
        <el-button class="button">启用</el-button>
      </div>
    </div>
    <!--    系统管理 --- 消息管理 -->
    <div v-if="name === 'message'">
      <div class="body-item">
        <el-button class="button">新增</el-button>
        <el-button class="button">修改</el-button>
        <el-button class="button">审核</el-button>
      </div>
    </div>
    <!--    系统管理 --- 操作日志  无-->


    <div class="body-item">
      <!--      询价单表格--><!--      询价单管理-->
      <quotation v-if="name === 'quotation' || name === 'quotationManage'"
                 ref="quotation"
                 :table-data="tableData"
                 :identity="identity"/>
      <!--      订单总览-->
      <order v-if="name === 'order'" :table-data="tableData" :identity="identity"/>
      <!--      客户管理-->
      <client v-if="name === 'client'" :table-data="tableData" :identity="identity"/>
      <!--      运输管理 -----在途跟踪-->
      <tracking v-if="name === 'tracking'" :table-data="tableData" :identity="identity"/>
      <!--    运输管理 --- 提货单 -->
      <bill-lading v-if="name === 'billLading'" :table-data="tableData"
                   :identity="identity"/>
      <!--    运输管理 --- 运输计划 -->
      <transport-plan v-if="name === 'transportPlan'" :table-data="tableData"
                      :identity="identity"/>
      <!--  运输计划/回单管理 --- 签收单-->
      <signature-receipt v-if="name === 'signatureReceipt'" :table-data="tableData"
                         :identity="identity"/>
      <!--  运输计划/回单管理 --- 回单交接-->
      <handover-receipt v-if="name === 'handoverReceipt'" :table-data="tableData"
                        :identity="identity"/>
      <!--  回单管理 --- 客户-->
      <receipt-manage v-if="name === 'receiptManage'" :table-data="tableData"
                      :identity="identity"/>
      <!--    调度管理 --- 调度配载-->
      <loading v-if="name === 'loading'" :table-data="tableData" :identity="identity"/>
      <!--    调度管理 --- 订单配发-->
      <order-allot v-if="name === 'orderAllot'" :table-data="tableData"
                   :identity="identity"/>
      <!--      结算管理 --- 订单结算-->
      <order-settlement v-if="name === 'orderSettlement'" :table-data="tableData"
                        :identity="identity"/>
      <!--      结算管理 --- 应收款结算-->
      <receivables-settlement v-if="name === 'receivablesSettlement'" :table-data="tableData"
                              :identity="identity"/>
      <!--      结算管理 --- 应付款结算-->
      <payable-settlement v-if="name === 'payableSettlement'" :table-data="tableData"
                          :identity="identity"/>
      <!--      发票管理-->
      <invoice v-if="name === 'invoice'" :table-data="tableData" :identity="identity"/>
      <!--      动力资源管理 --- 车辆管理-->
      <cars-manage v-if="name === 'carsManage'" :table-data="tableData" :identity="identity"/>
      <!--      动力资源管理 --- KPI管理-->
      <k-p-i-manage v-if="name === 'KPIManage'" :table-data="tableData" :identity="identity"/>
      <!--      动力资源管理 --- 人员管理-->
      <person-manage v-if="name === 'personManage'" :table-data="tableData"
                     :identity="identity"/>
      <!--    报价管理 --- 待报价订单-->
      <to-be ref="toBe" v-if="name === 'toBe'" :table-data="tableData" :identity="identity"/>
      <!--    报价管理 --- 常规路线报价-->
      <routine v-if="name === 'routine'" ref="routine"  :table-data="tableData" :identity="identity"/>
      <!--    合同管理 --- 合同统计 -->
      <contract-statistics v-if="name === 'contractStatistics'" :table-data="tableData"
                           :identity="identity"/>
      <!--    合同管理 --- 合同管理 -->
      <contract-manage v-if="name === 'contractManage'" :table-data="tableData"
                       :identity="identity"/>
      <!--    异常管理 --- 异常统计 -->
      <exception v-if="name === 'exception'" :table-data="tableData" :identity="identity"/>

      <!--    系统管理 --- 网点管理 -->
      <outlets v-if="name === 'outlets'" :table-data="tableData" :identity="identity"/>
      <!--    系统管理 --- 司机账号管理 -->
      <drivers-account v-if="name === 'driversAccount'" :table-data="tableData" :identity="identity"/>
      <!--    系统管理 --- 人员管理 -->
      <person v-if="name === 'person'" :table-data="tableData" :identity="identity"/>
      <!--    系统管理 --- 消息管理 -->
      <message v-if="name === 'message'" :table-data="tableData" :identity="identity"/>
      <!--    系统管理 --- 操作日志 -->
      <operation v-if="name === 'operation'" :table-data="tableData" :identity="identity"/>


      <!--      分页-->
<!--      <module-pagination :page="pagination.page"-->
<!--                         :page-size="pagination.pageSize"-->
<!--                         :total="total"/>-->
      <el-pagination
          class="pagination"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="pagination.page"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="pagination.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total">
      </el-pagination>
      <div style="clear: both;"></div>
    </div>

  </div>
</template>

<script>
import Quotation from "@/components/list/Quotation";
import Order from '@/components/list/Order'
import Client from "@/components/list/Client";
import Tracking from "@/components/list/Tracking";
import BillLading from "@/components/list/BillLading";
import TransportPlan from "@/components/list/TransportPlan";
import SignatureReceipt from "@/components/list/SignatureReceipt";
import HandoverReceipt from "@/components/list/HandoverReceipt";
import Loading from "@/components/list/Loading";
import OrderAllot from "@/components/list/OrderAllot";
import OrderSettlement from "@/components/list/OrderSettlement";
import PayableSettlement from "@/components/list/PayableSettlement";
import ReceivablesSettlement from "@/components/list/ReceivablesSettlement";
import ReceiptManage from "@/components/list/ReceiptManage";
import Invoice from "@/components/list/Invoice";
import CarsManage from "@/components/list/CarsManage";
import KPIManage from "@/components/list/KPIManage";
import PersonManage from "@/components/list/PersonManage";
import ContractManage from "@/components/list/ContractManage";
import ContractStatistics from "@/components/list/ContractStatistics";
import ToBe from "@/components/list/ToBe";
import Routine from "@/components/list/Routine";
import Exception from "@/components/list/Exception";
import Outlets from "@/components/list/Outlets";
import DriversAccount from "@/components/list/DriversAccount";
import Person from "@/components/list/Person";
import Message from "@/components/list/Message";
import Operation from "@/components/list/Operation";
import {carriersCarOptions,carriersCarStatusOptions,carriersKPIOptions,clientInput,carriersInput,driverInput}
  from "@/utils/constant/selecterConstant";
import {quotationPage} from "@/apis/order";
import {transportPage} from "@/apis/driver";
import {transportDelById} from "@/apis/driver";
import {driverToBePage} from "@/apis/driver";


export default {
  name: 'SearchAndRouterChange',
  components: {
     Quotation, Order, Client, Tracking, BillLading, TransportPlan,
    SignatureReceipt, HandoverReceipt, Loading, OrderAllot, OrderSettlement,
    PayableSettlement, ReceivablesSettlement, ReceiptManage, Invoice, CarsManage,
    KPIManage, PersonManage, ContractManage, ContractStatistics, ToBe, Routine, Exception,
    Outlets, DriversAccount, Person, Message, Operation,

  },
  props: {
    name: String, // 组件名称
    title: String,
    identity: String,

    pageData: {},
  },
  data() {
    return {
      pagination: {
        id: '',
        identity: '',
        value1: '',
        input: '',
        KPISort: '',
        value2: "",
        car: '',

        status: 0,
        carStatus: '',
        startTime: '',
        endTime: '',
        page: 1,
        pageSize: 10,
      },
      total: 0,
      tableData: [],

      active: 1,
      activeClass: 'active', // 选中的样式

      driverInput: [],
      clientInput: [],
      carriersInput: [],

      carriersKPIOptions: [],
      carriersCarOptions: [],
      carriersCarStatusOptions: [],

      radioSelect: '1' // 默认单选框选项
    }
  },
  created() {

    this.init()


  },
  methods: {
    // 初始化资源
    async init() {
      this.pagination = this.pageData

      this.pagination.id = localStorage.getItem("id")
      this.pagination.identity = localStorage.getItem("identity")

      this.clientInput = clientInput
      this.driverInput = driverInput
      this.carriersInput = carriersInput

      // 动力资源初始化
      this.carriersCarOptions = carriersCarOptions
      this.carriersCarStatusOptions = carriersCarStatusOptions
      // KPI管理资源初始化
      this.carriersKPIOptions = carriersKPIOptions
      // 统一分页
      this.page(-1)

    },
    // 统一分页
    page(){
      // 客户端询价单分页
      if (this.name === 'quotationManage' || this.name === 'quotation') {
        this.quotationPage(0)
      }else if(this.name === 'toBe'){
        this.toBePage(0)}
      else if(this.name === 'routine'){
        this.transportPage(-1)
      }
    },

    // 客户下单
    clientOrder(){
      let data = this.fetchRadioValue("quotation");
      if(data === undefined){return}
      if(data.number === undefined){return}
      if(data.status !== 6){this.$message.info("请选择待处理的订单");return}
      this.$router.push({name: 'showQuotation', query: {orderNumber: data.number,createOrder: true,status:data.status}})
    },
    // 司机添加报价-处理报价
    carriersDisposeQuote(){
      let data = this.fetchRadioValue("quotation");
      if(data === undefined){return}
      if(data.number === undefined){return}
      if(data.status !== 5){this.$message.info("请选择待处理的订单");return}
      this.$router.push({name: 'disposeQuotation', query: {orderNumber: data.number,showAdd:true,showInfo:true}})
    },
    // 司机处理询价单--报价
    disposeQuote(){
      let data = this.fetchRadioValue("toBe");
      if(data === undefined){return}
      if(data.number === undefined){return}
      if(data.status !== 3){this.$message.info("请选择待处理的订单");return}
      this.$router.push({name: 'disposeQuotation', query: {orderNumber: data.number,showAdd:true,showInfo:false}})
    },
    // 搜索
    search(name) {
      if (name.includes("quotation")) {
        // 查询全部，所有询价单信息
        this.quotationPage(0)
      }

    },
    // 获取单选框的选项
    fetchRadioValue(name) {
      const number = this.$refs[name].radioSelect;
      const status = this.$refs[name].status;
      if (number === "1") {this.$message.info("请选择一项");return;}
      return {number:number,status:status};
    },
    // 审核询价单
    auditQuotation() {
      let data = this.fetchRadioValue("quotation");
      if(data === undefined){return}
      if(data.number === undefined){return}
      if(data.status !== 1){this.$message.info("请选择待审核的订单");return}
      this.$router.push({name: 'showQuotation', query: {orderNumber: data.number, audit: true}})
    },
    // 处理询价单
    disposeQuotation(){
      let data = this.fetchRadioValue("quotation");
      if(data === undefined){return}
      if(data.number === undefined){return}
      if(data.status !== 2){this.$message.info("请选择待询价的订单");return}
      this.$router.push({name: 'disposeQuotation',query:{orderNumber:data.number,showAdd:false,showInfo:true}})
    },
    // 查看询价表
    quotationView() {
      let data = this.fetchRadioValue("quotation");
      if(data === undefined){return}
      if(data.number === undefined){return}
      this.$router.push({name: 'showQuotation', query: {orderNumber: data.number}})
    },
    // 跳转到添加运输路线
    transportAdd(){
      this.$router.push({name: 'createTransport'})
    },
    // 删除运输路线
    transportDel(){
      let data = this.fetchRadioValue("routine");
      if(data.number === undefined){return}
      transportDelById(data.number).then(resp => {
        if(resp?.data?.code === 1){
          this.$message.success("删除成功")
          this.transportPage(-1)
        }else{this.$message.error(resp?.data?.msg)}
      })

    },
    // 修改运输路线
    transportView(){
      let data = this.fetchRadioValue("routine");
      if(data === undefined){return}
      if(data.number === undefined){return}
      this.$router.push({name: 'createTransport',query:{orderNumber: data.number}}).catch(r => console.log(r))
    },
    // 客户端询价单分页
    quotationPage(code) {
      this.pagination.status = code
      quotationPage(this.pagination).then(resp => {
        if (resp?.data?.code === 1) {
          this.tableData = resp?.data?.data?.records
          this.total = resp?.data?.data?.total
        } else {this.$message.error(resp?.data?.msg)}
      })

    },
    // 司机运输路线分页
    transportPage(code){
      this.pagination.status = code
      transportPage(this.pagination).then(resp => {
        if (resp?.data?.code === 1) {
          this.tableData = resp?.data?.data?.records
          this.total = resp?.data?.data?.total
        } else {this.$message.error(resp?.data?.msg)}
      })
    },
    // 司机待报价分页查询
    toBePage(code){
      this.pagination.status = code
      driverToBePage(this.pagination).then(resp => {
        if (resp?.data?.code === 1) {
          this.tableData = resp?.data?.data?.records
          this.total = resp?.data?.data?.total
        } else {this.$message.error(resp?.data?.msg)}
      })
    },
    // 切换路由
    handoffRouter(router) {
      this.$router.push({name: router}).catch(r => console.log(r))
    },
    // 分页切换
    handleSizeChange(val) {
      console.log(val)
      this.pagination.pageSize = val
      this.page()
    },
    handleCurrentChange(val) {
      this.pagination.page = val
      this.page()
    },
    // 切换选中div
    change(i) {
      console.log(i)
    },
    // div选中
    divActive(i) {
      this.active = i
    },

    // 选择单选框
    handleRadioChange(row) {
      console.log(row)
    },

  },
}
</script>

<style scoped lang="scss">
.pagination{
  float: left;
  margin: 20px 35%;
}
.active {
  background-color: white;
  color: black;
}
.body-item {
  margin-top: 10px;

  .body-active {
    width: auto;
    text-align: center;
    margin-top: 10px;
    background-color: #B3C0D1;

    .active-item {
      float: left;
      width: 120px;
      max-width: 120px;
      height: 35px;
      line-height: 35px;
    }

    .active-item:hover {
      background-color: #D3DCE6;
      color: white;
    }
  }
}


</style>